<template>
	
<div class="kefu">
	<p style="display: flex;justify-content: center;align-items: center; font-size: .36rem;position: absolute;top: 0;width: 100%;background-color: white;left: 0;height: .95rem;">
		<span>客服咨询</span>
	</p>
	
	<div><span>手机号：{{kefulist.phone}}</span><button @click="copy(kefulist.phone)">点击复制</button></div>
	<div><span>邮箱：{{kefulist.email}}</span><button @click="copy(kefulist.email)">点击复制</button></div>
	<div><span>QQ：{{kefulist.qq}}</span><button @click="qqgo">QQ客服咨询</button></div>
</div>

	
	
	
</template>

<script>
	
	import {
    	kefu
	} from "@api/user";
	
	import {Toast} from 'vant'
	import Vue from 'vue'
	
	Vue.use(Toast)
 	
	export default {
		name: "kefu",
		data: function() {
			return {
				kefulist: "",
			};
		},
		mounted: function() {
			this.kefu()
		},
		methods: {
			copy(text){
				
				console.log(text)
								
				const input = document.createElement('input');
				document.body.appendChild(input);
				input.setAttribute('value', text);
				input.select();
				if (document.execCommand('copy')) {
					document.execCommand('copy');
					Toast("成功复制到剪切板！")
				}
				document.body.removeChild(input);
				
			},

			qqgo(){
				
				window.location.href='mqqwpa://im/chat?chat_type=wpa&uin=' + this.kefulist.qq + '&version=1&src_type=web&web_src=lvlingseeds.com'
				
			},
			async kefu() {
	
				kefu().then((res) => {
	
					this.kefulist = res.data
					
					this.kefulist.phone = this.kefulist.phone.split('"')[1]
					this.kefulist.email = this.kefulist.email.split('"')[1]
					this.kefulist.qq = this.kefulist.qq.split('"')[1]
					

				}).catch((error) => {
	
					this.kefulist = null
	
				})
	
			},


		}
	}
	
	
</script>

<style lang="scss" scoped>
	.kefu{
		padding: 0 .7rem;
		padding-top: 1.75rem;
		box-sizing: border-box;
		
		div{
			display: flex;
			align-items: center;
			justify-content: space-between;
			margin-top: .2rem;
		}
		
		button{
			padding: .1rem .1rem;
			background-color: rgba(25,120,237,.8);
			border-radius: .1rem;
			color: white;
		}
	}
</style>
